<div class="to-be-evaluated-container w100 h100">
  <div class="content-box" *ngIf="!view">
    <div class="table-top-search">
      <div class="top-search-right">
        <label>
          学年:
          <nz-select [(ngModel)]="searchParams.schoolYear" nzPlaceHolder="请选择">
            <nz-option *ngFor="let item of yearList" [nzLabel]="item.schoolYear" [nzValue]="item.schoolYear"></nz-option>
          </nz-select>
        </label>
        <label>
          学期:
          <nz-select [(ngModel)]="searchParams.semester" nzPlaceHolder="请选择">
            <nz-option *ngFor="let item of semesterList" [nzLabel]="item.semesterName" [nzValue]="item.semester"></nz-option>
          </nz-select>
        </label>
        <label>
          课程编号：
          <input nz-input type="text" [(ngModel)]="searchParams.number" placeholder="请输入">
        </label>
        <label>
          课程名称：
          <input nz-input type="text" [(ngModel)]="searchParams.name" placeholder="请输入">
        </label>
        <div class="table-top-btn">
          <button nz-button nzType="primary" (click)="clickSearch()">查询</button>
          <button nz-button nzType="default" (click)="resetSearch()">重置</button>
        </div>
      </div>
    </div>
    <div class="table-box">
      <ng-template #totalTemplate let-total>总共 {{ pageInfo.totalRecords? pageInfo.totalRecords:0 }} 条</ng-template>
      <nz-table
        nzBordered
        [nzData]="dataList"
        [nzFrontPagination]="false"
        [nzShowPagination]="true"
        [nzPageIndex]="pageInfo.first"
        [nzTotal]="pageInfo.totalRecords"
        [nzShowTotal]="totalTemplate"
        [nzPageSize]="pageInfo.rows"
        [nzLoadingDelay]="1"
        [nzPageSizeOptions]="[10,20,30,50,100]"
        [nzShowQuickJumper]="true"
        [nzShowSizeChanger]="true"
        (nzPageIndexChange)="changePageIndex($event)"
        (nzPageSizeChange)="changePageSize($event)"
        [nzWidthConfig]="nzWidthConfigs"
        [nzScroll]="{x: '2250px'}"
      >
        <thead>
        <tr>
          <th>序号</th>
          <th>学年</th>
          <th>学期</th>
          <th>课程编号</th>
          <th>课程名称</th>
          <th>课时</th>
          <th>课程类型</th>
          <th>开课部门</th>
          <th>任课教师</th>
          <th>工号</th>
          <th>职称</th>
<!--          <th>授课系部</th>-->
<!--          <th>授课专业</th>-->
<!--          <th>授课班级</th>-->
          <th>上课地点</th>
          <th>评价时间</th>
          <th nzRight="0px">操作</th>
        </tr>
        </thead>
        <tbody>
        <tr *ngFor="let item of dataList; let i = index;">
          <td>{{i + 1}}</td>
          <td>{{ item.schoolYear}}</td>
          <td>{{ item.semesterName}}</td>
          <td>{{ item.number}}</td>
          <td>{{ item.name}}</td>
          <td>{{ item.sectionCount}}</td>
          <td>{{ item.type}}</td>
          <td>{{ item.startDeptName}}</td>
          <td>{{ item.teacherName}}</td>
          <td>{{ item.teacherNumber}}</td>
          <td>{{ item.teacherTitle}}</td>
<!--          <td>{{ item.teachDeptName}}</td>-->
<!--          <td>{{ item.majorName}}</td>-->
<!--          <td>{{ item.classesName}}</td>-->
          <td>{{ item.address}}</td>
          <td>{{item.superviseDateStr}}</td>
          <td nzRight="0px">
            <span class="operaFont firOpera" (click)="clickEvaluate(item)">评价</span>
          </td>
        </tr>
        </tbody>
      </nz-table>
    </div>
  </div>
  <div class="info-box w100 h100" *ngIf="view">
    <div class="title">评价</div>
    <div class="question-box">
      <div class="content" id="contentRef">
        <div class="question-list">
         <div class="question-item" [id]="'questionItem-' + i" *ngFor="let item of evaluateList; let i = index;">
           <div class="question-title">
             {{i + 1}}、<span [innerHTML]="item.examQuestionContent"></span>
             <span *ngIf="item.examQuestionCate !== '简答题'">({{item.examQuestionScore}}分)</span>
           </div>
           <div class="question-operate">
             <div class="radio-question" *ngIf="item.examQuestionCate === '单选题'">
               <nz-radio-group [(ngModel)]="item.examSelectId" (ngModelChange)="changeQuestionIndex(i, item.selectList, $event)">
                 <label *ngFor="let ele of item.selectList" nz-radio [nzValue]="ele.id">
                   {{ele.name}}
                   <input *ngIf="item.inputFlag && ele.name === '差'"
                          style="width: 300px;display: inline-block;" type="text"
                          nz-input  placeholder="请输入理由" [(ngModel)]="item.content">
                 </label>
               </nz-radio-group>
             </div>
             <div class="short-answer-question" *ngIf="item.examQuestionCate === '简答题'">
               <textarea (ngModelChange)="changeQuestionIndex(i, item.selectList, $event)" rows="4" nz-input [(ngModel)]="item.content" placeholder="请输入"></textarea>
             </div>
           </div>
         </div>
        </div>
      </div>
      <div class="question-panel">
        <div class="panel">
          <div class="curr-process">
            <div class="txt">当前进度</div>
            <div class="process-number">{{answeredIndexArr.length}}/{{totalQuestionArr.length}}</div>
          </div>
          <div class="answer-card">
            <div class="answer-title">答题卡</div>
            <div class="status-box">
              <div class="status-item">
                已评
              </div>
              <div class="status-item">
                未评
              </div>
            </div>
          </div>
          <div class="answer-card-box">
            <div [ngClass]="['list-item', answeredIndexArr.includes(item) ? 'active' : '']"
                 (click)="clickAnswerIndex(i)"
                 *ngFor="let item of totalQuestionArr; let i = index">{{item + 1}}</div>
          </div>
        </div>
        <div class="btn-box">
          <button nz-button nzType="default" (click)="view = false;">返回</button>
          <button nz-button nzType="primary" (click)="submitEvaluate()">提交</button>
        </div>
      </div>
    </div>
  </div>
</div>
<nz-modal
  [(nzVisible)]="visible"
  nzWidth="680px"
  [nzTitle]="modalTitle"
  [nzContent]="modalContent"
  (nzOnCancel)="visible = false"
  [nzFooter]="footModel"
  nzMaskClosable="false"
>
  <ng-template #modalTitle>
    温馨提醒
  </ng-template>
  <ng-template #modalContent>
    <div class="modal-hei over-y">
      <div class="text-center">
        你还有未评价的题目，需要完成全部评价后才能提交！
      </div>
    </div>
  </ng-template>
  <ng-template #footModel>
    <div class="text-center">
      <button nz-button nzType="primary" (click)="visible = false">继续评价</button>
    </div>
  </ng-template>
</nz-modal>


<nz-modal
  [(nzVisible)]="visibleSubmit"
  nzWidth="680px"
  [nzTitle]="modalTitleSubmit"
  [nzContent]="modalContentSubmit"
  (nzOnCancel)="visibleSubmit = false"
  [nzFooter]="footModelSubmit"
  nzMaskClosable="false"
>
  <ng-template #modalTitleSubmit>
   温馨提醒
  </ng-template>
  <ng-template #modalContentSubmit>
    <div class="modal-hei over-y">
      <div class="text-center">
        提交以后不能修改，确定提交吗？
      </div>
    </div>
  </ng-template>
  <ng-template #footModelSubmit>
    <div class="text-center">
      <button nz-button nzType="default" (click)="visibleSubmit = false">取消</button>
      <button nz-button nzType="primary" (click)="clickConfirm()">确定</button>
    </div>
  </ng-template>
</nz-modal>
